<template>
	<div>
		<el-card class="box-card">
			<div class="flex_row" style="align-items: flex-end;">
				<div class="flex_a_center">
					<el-row>
						<el-form ref="planForm" :model="planForm" :rules="rules" :inline="true" label-width="80px">
							<el-col :xs="16" :sm="12" :md="8" :lg="8" :xl="6">
								<el-form-item label="方案名称" prop="name">
									<el-input v-model="planForm.name" :disabled="isDisabled" clearable
										class="my-search_datetime" size="mini" placeholder="请输入模板名称" />
								</el-form-item>
							</el-col>
							<el-col :xs="16" :sm="12" :md="8" :lg="8" :xl="6">
								<el-form-item label="考核月份" prop="assessMonth">
									<el-date-picker class="my-search_datetime" :disabled="isDisabled" v-model="planForm.assessMonth" type="month"
										value-format="yyyy-MM" placeholder="选择考核月份">
									</el-date-picker>
								</el-form-item>
							</el-col>
							<el-col :xs="16" :sm="12" :md="8" :lg="8" :xl="6">
								<el-form-item label="直属领导" prop="leader">
									<el-select v-model="planForm.leader" class="my-search_datetime" @change="leaderChange" filterable :disabled="isDisabled" value-key="userId"  placeholder="请选择考核人上级">
										<el-option v-for="(item,idx) in userList" :key="idx" :label="item.nickName" :value="item">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :xs="16" :sm="12" :md="8" :lg="8" :xl="6">
								<el-form-item label="定时发送" >
									<el-date-picker class="my-search_datetime" :disabled="isDisabled" :picker-options="pickerOptions" v-model="planForm.autoTime" type="datetime"
										value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择定时发送时间">
									</el-date-picker>
								</el-form-item>
							</el-col>
							<el-col :xs="16" :sm="12" :md="8" :lg="8" :xl="6">
								<el-form-item label="被考核人" prop="carryOutIds">
									<el-select class="my-search_datetime"  v-model="planForm.carryOutIds" filterable :disabled="isDisabled" multiple placeholder="请选择被考核人">
										<el-option v-for="(item,idx) in userList" :key="idx" :label="item.nickName" :value="item.userId">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :xs="16" :sm="12" :md="8" :lg="8" :xl="6">
								<el-form-item label="附件" >
									<div style="display: flex;"  v-if="!isDisabled">
									  <el-upload
									    ref="upload"
									    class="upload-file"
									    drag
									    action="no"
									    :multiple="true"
									    :http-request="upLoadFile"
									    :on-remove="handleRemove"
									    :auto-upload="false"
									    accept="."
									    :file-list="fileList"
									    :on-change="handleUploadChange"
											
									  >
									    <!-- <div slot="tip" class="el-upload__tip">上传文件大小不超过5M</div> -->
									    <el-button size="small" type="primary" :disabled="isDisabled">点击上传</el-button>
									  </el-upload>
									  <div style="margin-top: 10px;">
									    <div v-for="(file, index) in planForm.files" :key="index" style="color:#2a79ff;text-decoration: underline;cursor: pointer;">
									      <div style="margin-left: 5px;">
									        <el-link type="primary" :href="file.annexUrl" target="_blank">查看</el-link>
									      </div>
									    </div>
									  </div>
									</div>
									<template v-else>
										<div v-for="(file, index) in planForm.files" :key="index" style="color:#2a79ff;text-decoration: underline;cursor: pointer;">
										  <div style="margin-left: 5px;">
										    <el-link :underline="false" type="primary" :href="file.annexUrl" target="_blank" title="点击查看">{{file.fileName}}</el-link>
										  </div>
										</div>
									</template>
								</el-form-item>
							</el-col>
						</el-form>
					</el-row>
				</div>
				
				<div class="form_btn" v-if="!isDisabled">
					<el-button size="mini" type="warning" @click="visibleTemplate=true">选择模板</el-button>
					<el-button size="mini" type="primary" @click="sumbit">提交</el-button>
				</div>
				
			</div>
		</el-card>
		<el-collapse v-model="activeName" class="box-card" v-for="(item,idx) in planForm.details">
			<el-collapse-item :name="item.indicatorStatus">
				<template slot="title"  v-if="!isDisabled">
					<div class="flex_row title">
						<div>
							{{$store.getters.getIndicatorType[item.indicatorStatus]}}
							<el-button v-if="item.indicatorStatus=='ACQUIESCE'" style="margin-left: 10px;" type="primary"
								icon="el-icon-plus" plain @click.stop="addIndicatorType">添加指标类别</el-button>
						</div>
						<div class="flex_row">
							<template v-if="item.indicatorStatus=='ACQUIESCE'">
								<span class="icon_success" @click.stop="allocation(idx)">一键分配</span>
							</template>
							<span class="icon_normal" @click.stop="addIndicator(item,idx)">添加指标</span>
							<span class="icon_warning" @click.stop="operate('clean',idx)" >清空</span>
							<span class="icon_error" @click.stop="operate('del',idx)"
								v-if="item.indicatorStatus!='ACQUIESCE'">删除</span>
						</div>
					</div>
				</template>
				<div class="indicator_box" :style="getHeight()">
					<el-table :ref="'table'+idx" :data="item.entryList" :key="tableKey" :class="item.indicatorStatus+'-table'" row-key="indicatorLibraryCode" show-summary :summary-method="getSummaries" height="100%"
						border :cell-style="{ padding: '3px' }"
						:header-cell-style="{ backgroundColor:'#f4f4f4',textAlign:'center' }"
						style="width: 100%;position: absolute;">
						<el-table-column align="center" width="50" >
							<template>
								<i class="el-icon-s-operation sortable"></i>
							</template>
						</el-table-column>
						<el-table-column type="index" label="序号" width="50" />
						<el-table-column prop="indicatorLibraryName" label="指标名称" width="180" align="center" >
							<template slot-scope="{row,$index}">
								<span v-if="row.editStatus">
									<el-input v-model="row.indicatorLibraryName" clearable class="my_input" size="mini"
										placeholder="请输入指标名称" />
								</span>
								<span v-else>{{row.indicatorLibraryName}}</span>
							</template>
						</el-table-column>
						<el-table-column prop="indicatorGroupName" label="指标分组" width="140" align="center" />
						<el-table-column prop="indicatorLibraryWeight" label="指标权重/分值" width="200">
							<template slot-scope="{row,$index}">
								<span v-if="isDisabled">{{row.indicatorLibraryWeight}}</span>
								<el-input v-else v-model="row.indicatorLibraryWeight" type="number" clearable class="my_input" size="mini"
									placeholder="请输入指标权重" />
							</template>
						</el-table-column>
						<el-table-column prop="indicatorLibraryRemark" label="指标描述"  min-width="300">
							<template slot-scope="{row,$index}">
								<span v-if="row.editStatus">
									<el-input v-model="row.indicatorLibraryRemark" type="textarea" :autosize="{ minRows: 2, maxRows: 10}" clearable class="my_input" size="mini"
										placeholder="请输入指标描述" />
								</span>
								<span v-else>{{row.indicatorLibraryRemark}}</span>
							</template>
						</el-table-column>
						<el-table-column prop="assessStandardRemark" label="考核标准"  min-width="300">
							<template slot-scope="{row,$index}">
								<span v-if="row.editStatus">
									<el-input v-model="row.assessStandardRemark" type="textarea" :autosize="{ minRows: 2, maxRows: 10}" clearable class="my_input" size="mini"
										placeholder="请输入考核标准" />
								</span>
								<span v-else>{{row.assessStandardRemark}}</span>
							</template>
						</el-table-column>
						<el-table-column prop="assessScoringRules" label="计分规则"  min-width="300">
							<template slot-scope="{row,$index}">
								<span v-if="row.editStatus">
									<el-input v-model="row.assessScoringRules" type="textarea" :autosize="{ minRows: 2, maxRows: 10}" clearable class="my_input" size="mini"
										placeholder="请输入计分规则" />
								</span>
								<span v-else>{{row.assessScoringRules}}</span>
							</template>
						</el-table-column>
						<el-table-column prop="tool" label="管理工具"  min-width="300">
							<template slot-scope="{row,$index}">
								<el-input v-model="row.tool" type="textarea" :autosize="{ minRows: 2, maxRows: 10}" clearable class="my_input" size="mini"
									placeholder="请输入管理工具" />
							</template>
						</el-table-column>
						<el-table-column label="操作" width="100" align="center" fixed="right"  v-if="!isDisabled">
							<template slot-scope="{row,$index}">
								<i v-if="row.editStatus" class="iconfont icon_warning icon-a-queren" title="确认"
									@click="operate('edit',$index, row)" />
								<i v-else class="iconfont icon_warning icon-a-xiugai" title="修改" @click="operate('edit',$index, row)" />
								<i class="iconfont icon_error icon-a-shanchu" title="删除"
									@click="operate('del',$index,item.entryList)" />
							</template>
						</el-table-column>
					</el-table>
				</div>
			</el-collapse-item>
		</el-collapse>

		<!-- 指标类别 -->
		<el-dialog title="指标类别" custom-class="my_dialog" :visible.sync="visibleIndicatorType" width="400px">
			<div class="dialog-box">
				<el-checkbox-group v-model="indicatorType" size="medium">
					<el-checkbox :label="item.indicatorStatus" :key="item.indicatorStatus" :disabled=item.disabled
						v-for="item in indicatorTypeList">{{item.indicatorStatusName}}</el-checkbox>
				</el-checkbox-group>
			</div>
			<div slot="footer" class="dialog-footer">
				<el-button size="mini" @click="visibleIndicatorType=false">取 消</el-button>
				<el-button size="mini" type="primary" @click="dialogSure('indicatorType')">确 定</el-button>
			</div>
		</el-dialog>

		<!-- 指标 -->
		<el-dialog title="添加指标" custom-class="my_dialog" top="8vh" :visible.sync="visibleIndicator" width="80%">
			<div style="height:600px">
				<indicatorLibrary ref="indicatorLibrary" isCheckDialog :reserveSelection="reserveSelection"
					@selectionChange="selectionChange" />
			</div>
			<div slot="footer" class="dialog-footer">
				<el-button size="mini" @click="visibleIndicator=false">取 消</el-button>
				<el-button size="mini" type="primary" @click="dialogSure('indicator')">确 定</el-button>
			</div>
		</el-dialog>
		<!-- 模板 -->
		<el-dialog title="选择模板" custom-class="my_dialog" top="8vh" :visible.sync="visibleTemplate" width="80%">
			<div style="height:600px">
				<assessmentTemplate v-if="visibleTemplate" ref="assessmentTemplate" isCheckDialog
					@selectCard="selectTemplate" />
			</div>
			<div slot="footer" class="dialog-footer">
				<el-button size="mini" @click="visibleTemplate=false">取 消</el-button>
				<el-button size="mini" type="primary" @click="dialogSure('visibleTemplate')">确 定</el-button>
			</div>
		</el-dialog>

	</div>
</template>
<script>
	import indicatorLibrary from '../indicatorLibrary.vue'
	import assessmentTemplate from '../assessmentTemplate/index.vue'
	import Sortable from "sortablejs";
	import { debounce } from 'lodash'
	export default {
		name:'planDetails',
		components: {
			indicatorLibrary,
			assessmentTemplate,
		},
		data() {
			return {
				fileList: [],
				pickerOptions: {
					disabledDate: time => {
						return time.getTime() < Date.now()-1 * 24 * 60 * 60 * 1000
					}
				},
				rules: {
					name: [{
						required: true,
						message: '请输入方案名称',
						trigger: 'change'
					}],
					assessMonth: [{
						required: true,
						message: '请选择考核月份',
						trigger: 'change'
					}],
					leader: [{
						required: true,
						message: '请选择直属领导',
						trigger: 'change'
					}],
					carryOutIds: [{
						required: true,
						message: '请选择执行人员',
						trigger: 'change'
					}],
				},
				userList: [], //用户列表
				planForm: {
					name:'',
					assessMonth:'',
					leader:'',
					autoTime:'',
					carryOutIds:[],
					details: [],
					files:[]
				},
				isDetails: false, // 新增/详情
				isDisabled: false, // 是否已发起审批执行，已执行后不再允许修改
				selectData: '', //选择的模板数据
				tableKey: false,
				addIndicatorIdx: 0, // 指标类别序号
				reserveSelection: [], // 已选指标类别下的指标
				selectionList: [],
				activeName: [],
				indicatorTypeList: [],
				visibleTemplate: false,
				visibleIndicatorType: false,
				visibleIndicator: false,
				indicatorType: [], //指标类别复选框
				tableList: [], // 指标库列表
				searchForm: {
					current: 1,
					size: this.$defaultPage,
					groupId: '', // 指标分组
				},
				total: 0,
				isSumbitFinish:false
			}
		},
		computed: {
			
			totalIndicatorLibraryWeight() {
				let sum = 0
				this.planForm.details.some((item, idx) => {
					if (item.indicatorStatus == 'ACQUIESCE') {
						item.entryList.some((item2, idx2) => {
							sum += Number(item2.indicatorLibraryWeight)
						})
						return true
					}
				})
				return sum;
			}
		},
		beforeRouteLeave(to, from, next) {
			if(this.isSumbitFinish){
				to.meta.tagOpenCount ++
				from.meta.tagOpenCount ++
			}
			
		  next();
		},
		created() {
			this.indicatorTypeList = []
			this.activeName = []
			Object.keys(this.$store.getters.getIndicatorType).forEach(key => {
				this.activeName.push(key)
				this.indicatorTypeList.push({
					indicatorStatusName: this.$store.getters.getIndicatorType[key],
					indicatorStatus: key
				})
			});
			this.planForm.details = [{
				indicatorStatus: this.indicatorTypeList[0].indicatorStatus,
				indicatorStatusName: this.indicatorTypeList[0].indicatorStatusName,
				entryList: []
			}]


			this.getHeight()
			this.getUserList()
			this.getParam()
		},
		methods: {
			// 移出
			handleRemove(uploadFile, uploadFiles) {
			  this.fileList = uploadFiles
			  this.planForm.files.forEach((v, k) => {
			    if (v.annexUrl == uploadFile.annexUrl) {
			      this.planForm.files.splice(k, 1)
			    }
			  })
			},
			handleUploadChange: debounce(function(file, uploadFiles) {
			  this.upLoadFile(file, uploadFiles)
			}, 500),
			upLoadFile(sefile, uploadFiles) {
			  let file = sefile.raw
			  this.fileList = uploadFiles
			  let formData = new FormData()
			  // formData.append('file', file)
			  uploadFiles.filter(i => !i.annexUrl).map((item, i) => {
			    formData.append('file', item.raw)
			  })
			  this.$http.post('/ly-oms-servicer/upload/Annex', formData, res => {
			    if (res.code == 0) {
			      this.$message.success(res.message)
			      this.planForm.files = this.planForm.files.concat(res.responseBody)
			      this.fileList.forEach((item, i) => {
			        if (this.planForm.files[i]) {
			          item.annexUrl = this.planForm.files[i].annexUrl
			        }
			      })
						this.$forceUpdate()
			    } else {
			      this.$message.error(res.message || '请求失败')
			    }
			  })
			  this.$refs.upload.clearFiles()
			},
			disabledDate(time) {
			  // 获取当前日期
			  const today = new Date();
			  today.setHours(0, 0, 0, 0); // 设置时间为午夜12点，确保比较时不考虑时间部分
			  // 比较选中的日期是否小于当前日期
			  // return time.getTime() < today.getTime();    
			  return true    
			},
			// 表格行拖拽
			initSortable(){
				setTimeout(()=>{
					// 需要支持拖动效果的列表容器，在这里我们设置为el-table组件的tbody，
					// 注意：最前面的一段为前面el-table的class: draggable-table，主要为了防止如果页面有多个table，多个table同时实现拖拽效果
					// 当然，如果多个table都需要拖拽效果，选择器中最前面的.draggable-table可以去除。
					const tbody = document.querySelectorAll(".el-table__body-wrapper tbody");
					tbody.forEach((item,idx)=>{
						new Sortable(item, {
						  animation: 150,
							handle:'.sortable',
						  // 需要在odEnd方法中处理原始eltable数据，使原始数据与显示数据保持顺序一致
						  onEnd: ({ newIndex, oldIndex }) => {
						    const targetRow = this.planForm.details[idx].entryList[oldIndex];
						    this.planForm.details[idx].entryList.splice(oldIndex, 1);
						    this.planForm.details[idx].entryList.splice(newIndex, 0, targetRow);
						    // console.table(this.planForm.details[idx].entryList);
						  },
						}); 
					})
					this.$nextTick(()=>{
						this.planForm.details.forEach((item,idx)=>{
							this.$refs['table'+idx][0].doLayout()
						})
						
					})
				},500)
			},		 
			// 解析路由参数
			getParam() {
				const query = this.$route.query
				let res = query ? this.$decode(query) : ''
				if (res.code) {
					this.isDetails = true
					this.getDetials(res.code)
				}
			},
			// 选择直属领导
			leaderChange(e){
				this.planForm.leaderId=e.userId
				this.planForm.leaderName=e.nickName
				this.planForm.leaderDdId=e.ddOpenId
				this.$forceUpdate()
				
			},
			initArr(arr) {
				arr.some((item, idx) => {
					if (item.indicatorStatus == 'ACQUIESCE') {
						arr.unshift(arr.splice(idx, 1)[0])
						return true
					}
				})
				return arr
			},
			// 获取详情数据
			getDetials(code) {
				this.$API.assessOption.reqDetail(code).then((res) => {
					if (res.code == '0') {
						let arr = []
						this.fileList = []
						res.responseBody.details.forEach(item => {
							arr.push({
								indicatorStatus: item[0].indicatorStatus,
								indicatorStatusName: this.indicatorTypeList[item[0].indicatorStatus],
								entryList: item
							})
						})
						this.planForm = res.responseBody
						this.planForm.leader = {userId:this.planForm.leaderId}
						this.planForm.details = this.initArr(arr)
						this.planForm.carryOutIds = this.planForm.carryOutIds.split(',')
						this.planForm.files = this.planForm.files||[]
						this.fileList = this.planForm.files.map((item, index) => {
						  let obj = {
						    url: item.annexUrl,
						    annexUrl: item.annexUrl,
						    name: item.fileName
						  }
						  return obj
						})
						if(this.isDetails&&this.planForm.assessStatus!=='A'){
							this.isDisabled=true
						}
						this.initSortable()
						
					} else {
						this.$message.error(res.message)
					}
				})
			},
			// 校验权重/加减分必须大于0,通用类指标权重合计必须等于100
			checkData() {
				let status = true
				console.log(this.planForm.details)
				this.planForm.details.some((item, idx) => {
					if(!status){
						return
					}
					if (item.indicatorStatus == 'ACQUIESCE' && this.totalIndicatorLibraryWeight !== 100) {
						this.$message.warning('通用类指标权重的和必须等于100')
						status = false
						return true
					}
					item.entryList.some((item2, idx2) => {
						if (!(item2.indicatorLibraryWeight > 0)) {
							this.$message.warning('指标权重必须大于0')
							status = false
							return true
						}
						if (item2.indicatorLibraryRemark =='') {
							this.$message.warning('指标描述不能为空')
							status = false
							return true
						}
						if (item2.assessStandardRemark =='') {
							this.$message.warning('考核标准不能为空')
							status = false
							return true
						}
						if (item2.assessScoringRules =='') {
							this.$message.warning('计分规则不能为空')
							status = false
							return true
						}
					})
				})
				return status
			},
			// 提交
			sumbit() {
				this.$refs.planForm.validate((valid) => {
					if (valid && this.checkData()) {
						let arr = this.$uDeepClone(this.planForm.details)
						let details = []
						arr.forEach((item, idx) => {
							item.entryList.forEach((item2, idx2) => {
								item2.sort=idx2
								item2.indicatorStatus = item.indicatorStatus
								delete item2.id
								details.push(item2)
							})
						})
						let obj = this.$uDeepClone(this.planForm)
						obj.details = details
						obj.quantity = obj.carryOutIds.length
						obj.carryOutIds = obj.carryOutIds.join()
						this.$API.assessOption.reqCreate(obj).then((res) => {
							if (res.code == '0') {
								this.isSumbitFinish=true
								this.$message.success('操作成功')
								
								// 删除当前页
								this.$store.dispatch("delVisitedViews", this.$route);
								// 删除考核方案列表缓存
								this.$store.dispatch('delKeepViews','assessmentPlan')
								
								let url='/performanceSystem/assessmentManagement/assessmentPlan'
								setTimeout(()=>{
									// 删除考核方案列表
									this.$store.dispatch('delVisitedViews', {path:url})
									// 跳转考核方案列表
									this.$goPage({ path: url})
								},500)
							} else {
								this.$message.error(res.message)
							}
						})
					} else {
						console.log('error submit!!');
						return false;
					}
				})



			},
			// 获取用户列表
			getUserList(name) {
				this.$API.common.reqUserList().then((res) => {
					if (res.code == '0') {
						this.userList = res.responseBody || []
					}
				})
			},
			// 选择模板
			selectTemplate(e) {
				this.selectData = e
			},
			// 表格合计
			getSummaries(param) {
				const {
					columns,
					data
				} = param;
				const sums = []
				columns.forEach((column, index) => {
					if (index == 0) {
						sums[index] = '合计'
						return
					} else if (['indicatorLibraryWeight'].indexOf(column.property) > -1) {
						const values = data.map(item => Number(item[column.property]))
						if (!values.every(value => isNaN(value))) {
							sums[index] = values.reduce((prev, curr) => {
								const value = Number(curr)
								if (!isNaN(value)) {
									return prev + curr
								} else {
									return prev
								}
							}, 0)
							if (sums[index] !== 100) {
								sums[index] = <span class = {'red'}> {sums[index]} </span>} else {
								sums[index] = sums[index]
							}
						} else {
							sums[index] = ''
						}
					} else {
						sums[index] = ''
					}
				})
				return sums
			},
			// 指标选择
			selectionChange(e) {
				let arr = this.$uDeepClone(e)
				this.selectionList = arr
			},
			// 获取table高度
			getHeight() {
				let style = ''
				let len = this.planForm.details.length
				let height = 290
				if (len == 2) {
					height = 655
				}
				if (len > 2) {
					height = this.planForm.details.length * 200
				}
				style = 'height:calc(100vh - ' + height + 'px);'
				return style
			},
			// 一键分配
			allocation(idx) {
				let data = this.planForm.details[idx]
				let num1 = Math.floor(100 / data.entryList.length)
				let num2 = 100 - (num1 * (data.entryList.length - 1))
				data.entryList.forEach((item, idx) => {
					item.indicatorLibraryWeight = idx == 0 ? num2 : num1
				})

			},
			// 添加指标类型
			addIndicatorType() {
				this.indicatorType = []
				this.indicatorTypeList.forEach((item, idx) => {
					item.disabled = false
					this.planForm.details.some((item2, idx2) => {
						if (item.indicatorStatus == item2.indicatorStatus) {
							item.disabled = true
							return true
						}
					})
				})
				this.visibleIndicatorType = true
			},

			// 添加指标
			addIndicator(data, idx) {
				this.visibleIndicator = true
				this.addIndicatorIdx = idx
				let arr = []
				this.planForm.details.forEach((item, idx) => {
					arr = arr.concat(item.entryList || [])
				})
				this.reserveSelection = arr
				setTimeout(() => {
					this.$refs.indicatorLibrary.selectionDisable()
				}, 50)
			},

			// 添加指标/指标类型 确认事件
			dialogSure(type) {
				switch (type) {
					case 'indicatorType':
						this.indicatorType.forEach((item, idx) => {
							this.indicatorTypeList.some((item2, idx2) => {
								if (item == item2.indicatorStatus) {
									this.planForm.details.push(item2)
									return true
								}
							})
						})
						this.visibleIndicatorType = false
						break;
					case 'indicator':
						let arr = (this.planForm.details[this.addIndicatorIdx]).entryList || []
						let arr2 = []
						this.selectionList.forEach(item => {
							arr2.push({
								assessTemplateSystemCode: item.assessTemplateSystemCode,
								indicatorGroupSystemCode: item.indicatorGroupSystemCode,
								indicatorGroupName: item.indicatorGroupName,
								indicatorLibraryCode: item.code,
								indicatorLibraryName: item.name,
								indicatorLibraryRemark: item.remark,
								assessStandardRemark: item.standardRemark,
								indicatorStatus: item.indicatorStatus,
								assessScoringRules:item.scoringRules,
								indicatorLibraryWeight: 0,
							})
						})
						this.planForm.details[this.addIndicatorIdx].entryList = arr.concat(arr2)
						this.tableKey = !this.tableKey
						this.visibleIndicator = false
						this.initSortable()
						break;
					case 'visibleTemplate':
						this.$confirm('该操作将覆盖已填写的考核方案，是否继续？', '提示', {
							confirmButtonText: '确定',
							cancelButtonText: '取消',
							type: '',
							customClass: 'my_confirm'
						}).then(async () => {
							this.planForm.details = await this.getTemplateDetials(this.selectData.code)
							this.getHeight()
							this.tableKey = !this.tableKey
							this.visibleTemplate = false
							this.initSortable()
						})

						break;
				}
			},

			// 获取列表数据
			async searchOne(val) {
				let res = await this.$API.activeManage.reqSearchOne(val)
				let {
					code,
					responseBody
				} = res
				if (code == 0) {
					this.tableList = responseBody.records || []
					this.total = Number(responseBody.total)
				}
			},
			// 获取考核模板详情数据
			async getTemplateDetials(code) {
				let res = await this.$API.assessTemplate.reqDetail(code)
				let arr = []
				if (res.code == '0') {
					res.responseBody.details.forEach(item => {
						item.forEach(i => {
							i.indicatorLibraryWeight = 0
						})
						arr.push({
							indicatorStatus: item[0].indicatorStatus,
							indicatorStatusName: this.indicatorTypeList[item[0].indicatorStatus],
							entryList: item
						})
					})
				} else {
					this.$message.error(res.message)
				}
				return this.initArr(arr)
			},

			// 内部方法
			async operate(type, idx, item) {
				switch (type) {
					case 'edit': // 编辑
						this.$set(item, 'editStatus', !item.editStatus)
						break
					case 'del':
						this.$confirm('是否确定删除？', '提示', {
							confirmButtonText: '确定',
							cancelButtonText: '取消',
							type: '',
							customClass: 'my_confirm'
						}).then(() => {
							if (item) {
								console.log(item)
								item.splice(idx, 1)
							} else {
								this.planForm.details.splice(idx, 1)
							}
						})
						break
					case 'clean':
						this.$confirm('是否确定清空？', '提示', {
							confirmButtonText: '确定',
							cancelButtonText: '取消',
							type: '',
							customClass: 'my_confirm'
						}).then(() => {
							this.planForm.details[idx].entryList=[]
						})
						break
				}
			},



		}
	}
</script>

<style lang="scss" scoped>
	.box-card {
		background-color: #fff;
		margin: 10px 10px 0 10px;
		padding: 12px;

		.title {
			font-size: 15px;
			width: 100%;
			font-weight: bold;

			div:nth-child(1) {
				color: #006ee3;
			}
		}
	}

	.my_input {
		max-width: 300px;
		margin-right: 15px;
	}

	::v-deep .el-collapse-item__header,
	::v-deep .el-collapse-item__wrap {
		border: none;
	}

	::v-deep .el-collapse-item__content {
		padding-bottom: 0;
	}


	::v-deep .el-checkbox__label {
		line-height: 30px;
		font-size: 14px;
	}

	.main {
		margin-bottom: 10px;

		::v-deep th {
			height: 20px;
			padding: 1px;
		}
	}

	.dialog-box {
		padding: 10px 100px;
		margin-top: 20px;
	}

	.ann_input {
		width: 300px;
	}

	.indicator_box {
		min-height: 260px;
		position: relative;
	}

	.red {
		color: red
	}
	.form_btn {
		display: flex;
		justify-content: flex-end;
	}
	::v-deep .upload-file {
		display: flex;
	  margin: 0 10px;

	  .el-upload-dragger {
	    border: none;
	    width: 80px;
	    height: 28px;
	    border-radius: 3px;
	  }
		.el-upload-list__item-status-label{
			top: 5px;
		}
	}
	::v-deep .el-upload-list li {
	  height: 24px;
		margin-left: 10px;
	}
</style>